﻿<template>
  <base-dialog
    destroy-on-close
    show-footer
    :width="800"
    v-model="modalShow"
    title="商品日志"
    @close="hide"
    @cancel="hide"
    @confirm="hide"
  >
    <avue-crud
      :option="tableOption"
      :data="tableData"
      :page="pageParams"
      :table-loading="tableLoading"
      @refresh-change="loadProductLog"
      @current-change="loadTablePageChange"
      @size-change="loadTablePageSizeChange"
    ></avue-crud>
  </base-dialog>
</template>

<script setup>
  import option from "@/crudOption/product-list/log.js";
  const { tableOption } = option();
  const props = defineProps({
    visble: { type: Boolean, default: false },
    currentInfo: {
      type: Object,
      default: () => {
        return {};
      },
    },
  });
  const emit = defineEmits(["hide", "confirm"]);
  // 监听显隐
  watch(
    () => props.visble,
    v => {
      modalShow.value = v;
      if (props.visble) {
        init();
      }
    }
  );
  // 显示、隐藏
  const modalShow = ref(false);
  // 数据
  const tableData = ref([]);
  // 分页参数
  const pageParams = ref({
    pageNumber: 1,
    pageSize: 20,
    total: 0,
  });

  // 初始化
  const init = () => {
    loadProductLog();
  };
  // 获取日志数据
  const loadProductLog = () => {
    const params = {
      ...pageParams.value,
      operationType: 1,
      operationId: props.currentInfo.id,
    };
    delete params.total;
    Api.product.productLog(params).then(res => {
      tableData.value = res.data.records;
      pageParams.value.total = res.data.total;
    });
  };
  // 翻页
  const loadTablePageChange = () => {
    loadProductLog();
  };
  //
  const loadTablePageSizeChange = () => {
    loadProductLog();
  };
  // 关闭
  const hide = refresh => {
    emit("hide", refresh);
  };
</script>
